<!--
 * @Descripttion: 
 * @version: 
 * @Author: 宁乃楚
 * @Date: 2021-07-04 17:26:46
 * @LastEditors: 宁乃楚
 * @LastEditTime: 2021-07-07 16:42:45
-->
<template>
  <div class="info">
      <van-sticky :offset-top="0">
        <van-nav-bar
          title="用户个人信息"
          left-text="返回"
          left-arrow
          @click-left="onClickLeft"
        />
      </van-sticky>
    <div class="content">
        <!-- 用户Id -->
      <van-cell-group>
        <van-cell title="用户编号" :value="userInfo.id" />
      </van-cell-group>
      <!-- 用户名 -->
      <van-cell-group>
        <van-cell title="用户名" :value="userInfo.username" />
      </van-cell-group>
      <!-- 手机号 -->
      <van-cell-group>
        <van-cell title="手机号码" :value="userInfo.telephone" />
      </van-cell-group>
      <!-- 姓名 -->
      <van-cell-group>
        <van-cell title="姓名" :value="userInfo.realname" />
      </van-cell-group>
      <!-- 性别 -->
      <van-cell-group>
        <van-cell title="性别" :value="userInfo.gender=='male'?'男':userInfo.gender=='remale'?'女':''" />
      </van-cell-group>
      <!-- 认证状态 -->
       <van-cell-group>
        <van-cell title="认证状态" :value="userInfo.certificationStatus" />
      </van-cell-group>
      <!-- 认证时间 -->
       <van-cell-group>
        <van-cell title="认证时间" :value="userTime" />
      </van-cell-group>
    </div>
  </div>
</template>

<script>
// 引入vuex的辅助函数
import { mapActions, mapState } from "vuex";
export default {
  data() {
    return {
      userTime:''
    };
  },
  computed:{
      // 引入user vuex中的方法
    ...mapState("user", ["userInfo"]),
  },
  methods: {
     // 引入user vuex中的方法
    ...mapActions("user", ["getUserInfo"]),
    // 返回上一个页面
    onClickLeft() {
      this.$router.go(-1);
    },


        //标准时间转换为年月日 时分秒 格式
    formatTen(num) {
      return num > 9 ? num + "" : "0" + num;
    },
    formatDate(val) {
      // console.log(this.currentDate);
      if (val == null) {
        var date = new Date(this.currentDate);
      } else {
        var date = new Date(val);
      }

      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var day = date.getDate();
      var hour = date.getHours();
      var minute = date.getMinutes();
      var second = date.getSeconds();
      this.userTime =
        year +
        "-" +
        this.formatTen(month) +
        "-" +
        this.formatTen(day) +
        " " +
        this.formatTen(hour) +
        ":" +
        this.formatTen(minute) +
        ":" +
        this.formatTen(second);

      console.log(this.time);
    },

    timeChange(){
      this.formatDate(this.userInfo.certificationTime);
    }
  },
  created() {
    this.getUserInfo();
    this.timeChange();
  },
};
</script>

<style scoped>
.info /deep/ .van-nav-bar__title {
  color: white !important;
  font-size: 16px;
}
.info /deep/ .van-nav-bar {
  background-color: #fa5882;
  margin: 0;
  font-size: 16px;
}
.info /deep/ .van-nav-bar__text {
  color: white !important;
  font-size: 16px;
}
.info /deep/ .van-icon {
  color: white !important;
  font-size: 16px;
}
.van-cell{
    height: 50px;
    margin-bottom: 20px;
}
</style>